/*
 * @Author: 江舟 jijiangzhou@recycloud.cn
 * @Date: 2024-07-25 14:57:15
 * @LastEditors: 江舟 jijiangzhou@recycloud.cn
 * @LastEditTime: 2024-08-07 15:11:33
 * @FilePath: \vite-project\src\components\common\UserHelp.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */

import { Icon } from '@iconify/react/dist/iconify.js';
import { Badge, Popover } from 'antd';
import { useState } from 'react';

const UserHelp = () => {
	const [open, setOpen] = useState(false);

	const onOpenChange = (status: boolean) => {
		setOpen(status);
	};

	const content = (
		<a
			href="https://recycloud.feishu.cn/docx/ALTbdFRUtoOTY0x1p1icXCuYnkn?from=from_copylink"
			target="_blank"
			className="flex items-center text-black">
			<Icon icon="icon-park-twotone:book-open" className="mr-8px" width={18}></Icon>
			用户手册
		</a>
	);
	return (
		<Popover open={open} onOpenChange={onOpenChange} content={content} trigger="click">
			<Badge
				className={`px-12px block flex items-center h-38px rounded-38px transition-all ${
					open ? 'bg-primaryBg text-primary' : 'bg-white'
				}`}>
				<Icon icon="icon-park-twotone:help" width={18}></Icon>
			</Badge>
		</Popover>
	);
};

export default UserHelp;
